<template>
  <el-dialog
      :visible.sync="visible"
      width="54%"
      :before-close="onClose">
      <div slot="title" style="font-size: 14px;font-weight: 500;">
        方案名称：方案1<span style="margin-left: 8px;font-size: 12px;">最后修改时间：2024-04-01 09:18</span>
      </div>
      <div class="accept-container">
        <div class="dialog-head">
          <div>本方案已应用至下列企微号</div>
          <el-button type="primary" plain disabled size="small">批量操作</el-button>
        </div>
        <el-table
          :data="tableData"
          style="width: 100%">
          <el-table-column
            type="selection"
            width="60">
          </el-table-column>
          <el-table-column
            prop="number"
            label="企微号">
            <template slot-scope="scope">
              <div class="company-account">
                <img class="account-cover" src="https://wework.qpic.cn/wwpic/177031_HhrnVYv6QQSgQ2C_1686909054/0" />
                <div class="account-info">
                  <div class="name">闵雨微</div>
                  <div class="desc">@志新</div>
                </div>
              </div>
            </template>
          </el-table-column>
          <el-table-column
            prop="task_status"
            label="最后应用时间"
            >
          </el-table-column>
          <el-table-column
            prop="option"
            label="	最后应用账号"
          >
          </el-table-column>
          <el-table-column
            prop="option"
            label="方案状态"
          >
          <template slot-scope="scope">
            <el-switch />
          </template>
          </el-table-column>
          <template slot="empty">
            <TableEmpty />
          </template>
        </el-table>
      </div>
      <!-- <span slot="footer" class="dialog-footer">
        <el-button @click="onClose">取消</el-button>
        <el-button type="primary" @click="onClose">保存</el-button>
      </span> -->
    </el-dialog>
</template>
<script>
export default {
  data() {
    return {
      tableData: []
    }
  },
  props: ['visible'],
  methods: {
    onClose() {
      this.$emit('handCloseDialog');
    }
  },
}
</script>
<style lang="scss" scoped>
.accept-container{
  .dialog-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 16px;
  }
  .company-account {
    display: flex;
    align-items: center;
    .account-cover {
      width: 40px;
      height: 40px;
    }
    .account-info {
      margin-left: 8px;
      .name {
        font-size: 14px;
        line-height: 22px;
        color: #222333;
      }
      .desc {
        color: #f08b00;
        line-height: 22px;
      }
    }
    .accept-account {
      font-size: 14px;
      line-height: 22px;
    }
  }
}
</style>